//返回页面【编辑/新建/详情页面的返回】左侧一个返回按钮  右侧一个保存按钮的组件

import { Button, Space as SpaceWrapper } from '@kedacom/react-next'
import { FC } from 'react'
import { StyledBack, StyledBackPage } from './style'
interface ViewProps {
	/**标题 */
	title: string
	/**点击保存按钮 */
	onPass?: Function
	/**通过按钮上的文字*/
	passText?: string
	/** 点击拒绝按钮 */
	onReject?: Function
	/**拒绝按钮上的文字*/
	rejectText?: string
	/**是否需要展示按钮 ，默认需要*/
	isShowBtn?: boolean
	isRejectBtn?: boolean
	/**是否禁用保存按钮 */
	isDisabled?: boolean
	/**点击返回上一个页面按钮 */
	onBack?: Function
}

const useHook = (onBack: Function | undefined) => {
	const handleBack = () => {
		onBack && onBack()
	}
	return {
		handleBack,
	}
}

const BackPageView: FC<ViewProps> = ({
	title,
	onPass,
	onReject,
	onBack,
	isShowBtn = true,
	isRejectBtn = true,
	...props
}) => {
	const { handleBack } = useHook(onBack)
	return (
		<StyledBackPage className="back-page">
			<div className="back">
				<StyledBack onClick={() => handleBack()}></StyledBack>
				<div className="title">{title || '详情'}</div>
			</div>
			{isShowBtn ? (
				<SpaceWrapper className="btn">
					<Button disabled={props.isDisabled} onClick={() => onPass && onPass()}>
						{props.passText || '通过'}
					</Button>
					{isRejectBtn ? (
						<Button disabled={props.isDisabled} onClick={() => onReject && onReject()}>
							{props.rejectText || '拒绝'}
						</Button>
					) : null}
					{props.children}
				</SpaceWrapper>
			) : null}
		</StyledBackPage>
	)
}
export default BackPageView
